<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:p="http://primefaces.org/ui">
    <h:head>
        <h:outputStylesheet library="bootstrap/css" name="bootstrap.css"/>
        <h:outputStylesheet library="bootstrap/css" name="bootstrap-theme.css"/>
        <h:outputStylesheet library="css" name="login.css"/>
        <title>Iniciar sesi&oacute;n</title>
    </h:head>
    <h:body>
        <p:ajaxStatus onstart="PF('status').show()" oncomplete="PF('status').hide()"/>
        <div class="container">
            <h:graphicImage style="display: block;margin:25px auto 25px auto;" height="150" library="img" name="logo-icad.png"/>
            <h3 class="form-login-h1" >Sistema Administrativo</h3>
            <div class="row">

                <div class="col-sm-6 col-md-4 col-md-offset-4">
                    <div class="panel panel-default">
                        <div class="panel-heading">
                            <strong class="">Iniciar sesi&oacute;n</strong>
                        </div>
                        <div class="panel-body">
                            <h:form class="form-horizontal" id="mainform" >
                                <p:growl id="msgGlobal" globalOnly="true" showSummary="true" showDetail="true"/>
                                <div class="form-group">
                                    <label class="col-sm-3 control-label">Usuario</label>
                                    <div class="col-sm-9">
                                        <p:inputText id="txUsername" required="true" value="#{loginController.username}"
                                                     requiredMessage="Introduzca su usuario" styleClass="form-control" />
                                        <p:message for="txUsername" />
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-sm-3 control-label">Password</label>
                                    <div class="col-sm-9">
                                        <p:password id="txPassword" required="true" value="#{loginController.password}"
                                                    requiredMessage="Introduzca su password" styleClass="form-control"/>
                                        <p:message for="txPassword" />
                                    </div>
                                </div>
                                <div class="form-group">
                                    <div class="col-sm-offset-3 col-sm-9">
                                        <div class="checkbox">
                                            <label class="">
                                                <input class="" type="checkbox"/>Remember me</label>
                                        </div>
                                    </div>
                                </div>
                                <div class="form-group last">
                                    <div class="col-sm-offset-3 col-sm-9">
                                        <p:commandButton value="Login" update="mainform" styleClass="btn-success"
                                                         action="#{loginController.login()}"/>
                                    </div>
                                </div>
                            </h:form>
                        </div>
                        <div class="panel-footer">No te has registrado? <a href="#" class="">Registrate aqui</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <p:dialog widgetVar="status" modal="true" closable="false" maximizable="false" minimizable="false"
                  resizable="false">
            <h:panelGrid columns="1">
                <h:graphicImage library="img" name="ajax-loader.gif"/>
                <h:outputLabel value="por favor espere..." style="font-weight: normal;padding: 5px" />
            </h:panelGrid>
        </p:dialog>
    </h:body>
</html>

